.subject-header {
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
    padding: 10px;
    font-size: 13px;
    line-height: 120%;
}

.subject-info {
    display: -webkit-flex;
    display: flex; 
}

.subject-meta {
    margin-left: 10px;
}

.subject-meta p {
    padding-left: 10px;
}

.subject-op {
    align-self: center;
}

.subject-meta .title {
    font-size: 1.75rem;
    font-weight: bold;
}

.btn-success {
    border-radius: 40px;
    color: #fff;
    background-color: #42c02e;
    border-color: #42c02e;
    width: 90px;
    outline: none;
}

.btn-followed {
    border-radius: 40px;
    color: #8c8c8c;
    border: 1px solid hsla(0,0%,59%,.6);
    background: none;
    width: 90px;
    padding-left: 9px;
    outline: none;
}

.btn-followed:focus,.btn-followed:hover {
    color: #8c8c8c;
    background-color: #8c8c8c;
    border-color: #969696!important;
    background-color: hsla(0,0%,39%,.05)!important
}

.btn-hollow {
    border: 1px solid rgba(59,194,29,.7);
    color: #42c02e!important;
    border-radius: 40px;
    background-color: white;
    width: 90px;
    outline: none;
}

.btn-hollow:focus,.btn-hollow:hover {
    border: 1px solid #42c02e;
    color: #42c02e!important;
    background-color: rgba(59,194,29,.05)
}

.trigger-menu {
    margin-bottom: 20px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 0;
    list-style: none;
    padding-left: 10px;
}

.trigger-menu li {
    position: relative;
    display: inline-block;
    padding: 8px 0;
    margin-bottom: -1px;
}

.trigger-menu li.active {
    border-bottom: 2px solid #646464;
    padding: 8px 0;
    margin: 0;
}

.trigger-menu a {
    padding: 13px 20px;
    font-size: 15px;
    font-weight: 700;
    color: #969696;
    line-height: 25px;
}

.trigger-menu .active a, .trigger-menu a:hover {
    color: #646464;
    text-decoration: none;
}

.trigger-menu i {
    margin-right: 5px;
    font-size: 17px;
}

.trigger-menu li:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -2px;
    width: 100%;
    opacity: 0;
    border-bottom: 2px solid #646464;
    transform: translate(-50%) scaleX(0);
    -webkit-transform: translate(-50%) scaleX(0);
    -moz-transform: translate(-50%) scaleX(0);
    -o-transform: translate(-50%) scaleX(0);
    -ms-transform: translate(-50%) scaleX(0)
}

.trigger-menu li:after,.trigger-menu li:hover:after {
    transition: .2s ease-in-out;
    -webkit-transition: .2s ease-in-out;
    -moz-transition: .2s ease-in-out;
    -o-transition: .2s ease-in-out;
    -ms-transition: .2s ease-in-out
}

.trigger-menu li:hover:after {
    opacity: 1;
    transform: translate(-50%) scaleX(1);
    -webkit-transform: translate(-50%) scaleX(1);
    -moz-transform: translate(-50%) scaleX(1);
    -o-transform: translate(-50%) scaleX(1);
    -ms-transform: translate(-50%) scaleX(1)
}

#list-container {
    padding: 0 10px;
}

.sidebar .tag {
    padding: 1px 3px;
    margin-left: 2px;
    border-radius: 3px;
    font-size: 12px;
    color: #969696;
    border: 1px solid #969696;
}

.sidebar .tag:hover {background-color:white; text-decoration: none; }

.note-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.note-list li {
    position: relative;
    width: 100%;
    margin: 0 0 17px;
    padding: 0 2px 17px 0;
    border-bottom: 1px solid #f0f0f0;
    word-wrap: break-word;
}

.note-list li.have-img {
    min-height: 140px;
}

.note-list .have-img .wrap-img {
    position: absolute;
    top: 50%;
    margin-top: -68px;
    right: 0;
    width: 150px;
    height: 120px;
}

.note-list .have-img .wrap-img img {
    width: 100%;
    height: 100%;
    border-radius: 4px;
    border: 1px solid #f0f0f0;
}

.note-list .have-img>div {
    padding-right: 160px;
}

.note-list .author {
    margin-bottom: 14px;
    font-size: 13px;
}

.note-list .author .avatar {
    margin: 0 5px 0 0;
    width: 32px;
    height: 32px;
    display: block;
    cursor: pointer;
}

.note-list .author .avatar img {
    width: 100%;
    height: 100%;
    border: 1px solid #ddd;
    border-radius: 50%;
}

.note-list .author .avatar, .note-list .author .info {
    display: inline-block;
    vertical-align: middle;
}

.note-list .author a {
    color: #333;
}

.note-list .author .info .nickname {
    vertical-align: middle;
}

.note-list .author .info span {
    display: inline-block;
    padding-left: 3px;
    color: #969696;
    vertical-align: middle;
}

.note-list .author .time {
    color: #969696;
}

.note-list .article-title {
    margin: -7px 0 4px;
    display: inherit;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
    color: #333;
}

.note-list .article-title:visited {
    color: #969696;
}

.note-list .abstract {
    margin: 0 0 8px;
    font-size: 13px;
    line-height: 24px;
}

.note-list .article-meta {
    padding-right: 0!important;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
}

.note-list .article-meta a, .note-list .article-meta a:hover {
    transition: .1s ease-in;
    -webkit-transition: .1s ease-in;
    -moz-transition: .1s ease-in;
    -o-transition: .1s ease-in;
    -ms-transition: .1s ease-in;
}

.note-list .article-meta a {
    margin-right: 10px;
    color: #b4b4b4;
}

.note-list .article-meta a:hover {
    color: #787878;
    text-decoration: none;
}

.note-list .article-meta span {
    margin-right: 10px;
    color: #b4b4b4;
}

.sidebar .users {}

.sidebar .users li {
    display: inline-block;
}
.sidebar .users li:first-child {
    margin-left: -3px;
}

.sidebar .users li a {
    margin-right: -12px;
    display: inline-block;
}

.sidebar .users li img {
    border: 3px solid #fff;
    background-color: #fff;
}

/* 文章详情专题 */
@media (min-width: 768px) {
	.right {
		text-align: right;
	}
}

.subject .item-list {
	padding-top: 20px;
	padding-left: 12px;
	padding-right: 12px;
}

.subject .item-list .add-collection {
	display: inline-block;
	padding: 8px 12px;
	font-size: 14px;
	border: 1px solid #DCDCDC;
	border-radius: 4px;
}

.subject .item {
	display: inline-block;
	margin: 0 12px 12px 0;
	min-height: 32px;
	border: #cccccc 1px solid;
	background-color: #ffffff;
	border-radius: 4px;
	vertical-align: top;
	overflow: hidden;
	padding-right: 5px;
}

.subject a.item:hover,.subject a.add-collection:hover {
	text-decoration: none;
}